<template>
  <div>
    <div><center><h1>公司申请表创建</h1></center></div>
    <div>
          请选择流程：<el-select v-model="process_id" placeholder="请选择流程" @change="apply">
                        <el-option
                        v-for="item in lst1"
                        :key="item.id"
                        :label="item.process"
                        :value="item.id">
                        </el-option>
                    </el-select>   
    </div>
    <span v-show="num==1">
        <el-form ref="form" v-for="(item,i) in style" :key="i" v-model="form" label-width="80px">
            <el-form-item :label='item.attr'>
                <span v-show="item.way=='text'">
                    <el-input v-model="form[item.attr]" placeholder="请输入姓名"></el-input>
                </span>
                <span v-show="item.way=='textarea'">
                    <el-input v-model="form[item.attr]" type="textarea" ></el-input>
                </span>
                <span v-show="item.attr=='起始时间'">
                    <el-input v-model="form[item.attr]" placeholder="请输入起始时间"></el-input>
                </span>
                <span v-show="item.attr=='结束时间'">
                    <el-input v-model="form[item.attr]" placeholder="请输入结束时间"></el-input>
                </span>
            </el-form-item>
        </el-form>
        <el-button @click="realApply">确认申请</el-button>
    </span>
  </div>
</template>

<script>

export default {
data(){
    return{
        lst1:[],
        process_id:'',
        num:0,
        style:[],
        form:{}
    }
},
mounted(){
    this.getPro()
},
methods:{
    getPro(){
        this.$axios.get('process/api/v1/process/')
        .then(res=>{
            console.log(res)
            if (res.data.code == 200){
                this.lst1 = res.data.data
            }
        })
    },
    apply(){
        this.$axios.get('process/api/v1/style/'+this.process_id+'/')
        .then(res=>{
            console.log(res)
            if (res.data.code == 200){
                this.style = res.data.data
                this.num = 1
            }
        })
    },
    realApply(){
        this.$axios.post('process/api/v1/apply/',{
            form:this.form,
            process_id:this.process_id
        })
        .then(res=>{
            console.log(res)
            if(res.data.code == 200){
                alert(res.data.msg)
                
            }
        })
    }
}
}
</script>

<style>

</style>